<script setup>
import buttonVue from '../button/button.vue';
import { RouterLink } from 'vue-router'
import { ref, onMounted } from 'vue'
import { useRouter, useRoute } from 'vue-router'
import qs from 'qs'
import axios from 'axios'
import { ElMessageBox } from 'element-plus'
import jwt_decode from "jwt-decode";

const router = useRouter();

const num = ref(0)

const status = ref(0)

let userId = ref()

const header = ref('')

const userNumber = ref('') //用户账号

const value = ref('') //下拉选框类别的返回信息

const targetUserNumber = ref('') //商户账号

const targetUserNumbers = ref() //转账账号

const money = ref('') //输入的付款金额

const payLimit = ref('')//设置的限制金额

const transferAmount = ref() //转账的金额

const accountNumber = ref('') //下拉框的银行卡或者信用卡账号 

const recharge = ref('支付密码')

const payPassword1 = ref() //输入的支付密码

let token = jwt_decode(localStorage.getItem("token"))
if (token == null) {
    token = jwt_decode(localStorage.getItem("longToken"))
}

//初始化从本地获取参数赋值到当下页面
onMounted(() => {
    userNumber.value = sessionStorage.getItem("userNumber")//用户账号 
    value.value = sessionStorage.getItem("payType") //下拉选框类别的返回信息
    money.value = sessionStorage.getItem("amount") //输入的付款金额
    targetUserNumber.value = sessionStorage.getItem("targetUserNumber") //商户账号
    accountNumber.value = sessionStorage.getItem("accountNumber") //下拉框的银行卡或者信用卡账号 
    header.value = sessionStorage.getItem('header') //表头
    payLimit.value = sessionStorage.getItem('payLimit') //限额金额
    //JSON.parse 是将json对象解析成字符串
    userId.value = JSON.parse(sessionStorage.getItem('userId')); //用户id
    transferAmount.value = sessionStorage.getItem('transferAmount') //转账输入的金额
    targetUserNumbers.value = sessionStorage.getItem('targetUserNumbers')//转账的账号

    sessionStorage.setItem("goto", recharge.value)
})

function toThrid() {
    num.value++;
    if (num.value != 3) {
        axios.post("http://192.168.110.221:8080/user/checkPayPasswordController",
            qs.stringify({
                token: localStorage.getItem("token"),
                longToken: localStorage.getItem("longToken"),
                userId: token.userId,
                userNumber: token.userNumber,
                payPassword: payPassword1.value,
            })).then((resp) => {
                console.log(resp)
                if (resp.data.code == 200) {
                    console.log(resp.data.msg);
                    //密码输入成功的时候才是再次请求
                    if (header.value == "提现") {
                        withdrawal()
                    } else if (header.value == "充值") {
                        recharge1()
                    } else if (header.value == '支付限额') {
                        payLimit1()
                    } else if (header.value == '钱包转账') {
                        transferAccounts()
                    } else {
                        transfer()
                    }
                    // router.push('/')
                } else if (resp.data.code == 7001) {
                    console.log(resp.data.msg);
                    open("输入密码错误")
                } else if (resp.data.code == 400) {
                    console.log(resp.data.msg);
                    open("输入格式错误")
                } else {
                    console.log(resp.data.msg);
                    open("服务器错误")
                }
            }).catch((e) => {
                //跳转到404错误页面
                router.push('/login')
            })
    } else {
        axios.get("http://192.168.110.221:8080/user/updateStatusController", {
            params: {
                status: status.value,
                token: localStorage.getItem("token"),
                longToken: localStorage.getItem("longToken"),
                userId: token.userId,
                userNumber: token.userNumber,
            }
        }).then((resp) => {
            console.log(resp)
            if (resp.data.code == 200) {
                console.log(resp.data.msg);
                prompt("你的账号已经被冻结!请重新登录")   
                router.push('/login')
                localStorage.removeItem("token")
                localStorage.removeItem("longToken")
            } else if (resp.data.code == 400) {
                console.log(resp.data.msg);
                open("冻结失败")
            }
        }).catch((e) => {
            //跳转到404错误页面
            router.push('/login')
        })
    }
}
//钱包转账的第二次请求
function transferAccounts() {
    //当密码输入正确后再次请求后端数据
    axios.post("http://192.168.110.221:8080/user/transferByWalletController",
        qs.stringify({
            payLimit: payLimit.value,
            userNumber: userNumber.value,
            targetUserNumber: targetUserNumbers.value,
            transferAmount: transferAmount.value,
            token: localStorage.getItem("token"),
            longToken: localStorage.getItem("longToken"),
            userId: token.userId,
            userNumber: token.userNumber,

        })).then((resp3) => {
            if (resp3.data.code == 200) {
                //支付成功
                console.log(resp3.data.msg);
                success("转账成功")
                router.push('/')
            } else if (resp3.data.code == 7001) {
                //超出钱包每日限额
                console.log(resp3.data.msg);
                open("未设置支付密码")
                //有问题
                router.push('/wallet-transfer')
            } else if (resp3.data.code == 400) {
                //参数不能为空
                console.log(resp3.data.msg);
                open(resp3.data.msg)
                router.push('/wallet-transfer')
            } else if (resp3.data.code == 500) {
                //服务器错误
                console.log(resp3.data.msg);
                open("服务器错误")
                router.push('/wallet-transfer')
            }
        }).catch((e) => {
            //跳登录页面
            router.push('/login')
        })
}

//限额的第二次请求
function payLimit1() {
    //当密码输入正确后再次请求后端数据
    axios.post("http://192.168.110.221:8080/user/updatePayLimitController",
        qs.stringify({
            payLimit: payLimit.value,

            payPassword: payPassword1.value,

            token: localStorage.getItem("token"),
            longToken: localStorage.getItem("longToken"),
            userId: token.userId,
            userNumber: token.userNumber,
        })).then((resp3) => {
            console.log(payLimit.value);
            if (resp3.data.code == 200) {
                //支付成功
                console.log(resp3.data.msg);
                success("更新成功")
                router.push('/')
            } else if (resp3.data.code == 7001) {
                //超出钱包每日限额
                console.log(resp3.data.msg);
                open("支付密码为空")
                //有问题
                router.push('pay-limit')
            } else if (resp3.data.code == 400) {
                //参数不能为空
                console.log(resp3.data.msg);
                open("支付密码错误")
                router.push('pay-limit')
            } else if (resp3.data.code == 500) {
                //服务器错误
                console.log(resp3.data.msg);
                open("服务器错误")
                router.push('pay-limit')
            }
        }).catch((e) => {
            //跳登录页面
            router.push('/login')
        })
}

//提现的第二次请求
function withdrawal() {
    //当密码输入正确后再次请求后端数据
    axios.post("http://192.168.110.221:8080/user/cashOutController",
        qs.stringify({

            accountNumber: accountNumber.value,
            amount: money.value,
            token: localStorage.getItem("token"),
            longToken: localStorage.getItem("longToken"),
            userId: token.userId,
            userNumber: token.userNumber,
        })).then((resp2) => {
            console.log(userNumber.value);
            console.log(accountNumber.value);
            console.log(money.value);
            if (resp2.data.code == 200) {
                //支付成功
                console.log(resp2.data.msg);
                success("提现成功")
                router.push('/')
            } else if (resp2.data.code == 7000) {
                console.log(resp2.data.msg);
                //账户余额不足
                open("账户余额不足")
                router.push('withdrawal')
            } else if (resp2.data.code == 7001) {
                //超出钱包每日限额
                console.log(resp2.data.msg);
                open("未设置支付密码")
                //有问题
                router.push('withdrawal')
            } else if (resp2.data.code == 400) {
                //参数不能为空
                console.log(resp2.data.msg);
                open("参数不能为空")
                router.push('withdrawal')
            } else if (resp2.data.code == 500) {
                //服务器错误
                console.log(resp2.data.msg);
                open("服务器错误")
                router.push('withdrawal')
            }
        }).catch((e) => {
            //跳登录页面
            router.push('/login')
        })
}

//充值的第二次请求
function recharge1() {
    //当密码输入正确后再次请求后端数据
    axios.post("http://192.168.110.221:8080/user/rechargeController",
        qs.stringify({
            accountNumber: accountNumber.value,
            amount: money.value,
            token: localStorage.getItem("token"),
            longToken: localStorage.getItem("longToken"),
            userId: token.userId,
            userNumber: token.userNumber,
        })).then((resp3) => {
            console.log(userNumber.value);
            console.log(accountNumber.value);
            console.log(money.value);
            if (resp3.data.code == 200) {
                //支付成功
                console.log(resp3.data.msg);
                success("充值成功")
                router.push('/')
            } else if (resp3.data.code == 7000) {
                console.log(resp3.data.msg);
                //账户余额不足
                open("账户余额不足")
                router.push('recharge')
            } else if (resp3.data.code == 7001) {
                //超出钱包每日限额
                console.log(resp3.data.msg);
                open("未设置支付密码")
                //有问题
                router.push('recharge')
            } else if (resp3.data.code == 400) {
                //参数不能为空
                console.log(resp3.data.msg);
                open("参数不能为空")
                router.push('recharge')
            } else if (resp3.data.code == 500) {
                //服务器错误
                console.log(resp3.data.msg);
                open("服务器错误")
                router.push('recharge')
            }
        }).catch((e) => {
            //跳登录页面
            router.push('/login')
        })
}

//向商家付款的第二个请求
function transfer() {
    //当密码输入正确后再次请求后端数据
    axios.post("http://192.168.110.221:8080/user/checkPayPasswordAfterController",
        qs.stringify({
            accountNumber: accountNumber.value,
            targetUserNumber: targetUserNumber.value,
            payType: value.value,
            amount: money.value,
            token: localStorage.getItem("token"),
            longToken: localStorage.getItem("longToken"),
            userId: token.userId,
            userNumber: token.userNumber,
        })).then((resp1) => {
            console.log(userNumber.value);
            console.log(accountNumber.value);
            console.log(targetUserNumber.value);
            console.log(value.value);
            console.log(money.value);
            if (resp1.data.code == 200) {
                //支付成功
                console.log(resp1.data.msg);
                success("支付成功")
                router.push('/')
            } else if (resp1.data.code == 7000) {
                console.log(resp1.data.msg);
                //账户余额不足
                open("账户余额不足")
                router.push('/select-merchant-payment')
            } else if (resp1.data.code == 7001) {
                //超出钱包每日限额
                console.log(resp1.data.msg);
                open("超出钱包今日限额")
                router.push('/select-merchant-payment')
            } else if (resp1.data.code == 7002) {
                //超出今日限额
                console.log(resp1.data.msg);
                open("超出今日限额")
                router.push('/select-merchant-payment')
            } else if (resp1.data.code == 400) {
                //参数不能为空
                console.log(resp1.data.msg);
                open(resp1.data.msg)
                router.push('/select-merchant-payment')
            } else if (resp1.data.code == 500) {
                //服务器错误
                console.log(resp1.data.msg);
                open("服务器错误")
                router.push('/select-merchant-payment')
            }
        }).catch((e) => {
            //跳登录页面
            router.push('/login')
        })
}
function open(errormsg) {
    ElMessageBox.alert(errormsg, '验证失败!', {
        confirmButtonText: '确认',
    })
}

function success(msg) {
    ElMessageBox.alert(msg, '转账成功!', {
        confirmButtonText: '确认',
    })
}

function prompt(msg) {
    ElMessageBox.alert(msg, '账号冻结提示!', {
        confirmButtonText: '确认',
    })
}
</script>

<template>
    <div class="container">
        <div class="box">
            <h1 class="title">输入支付密码</h1>
            <input type="password" placeholder="输入支付密码" v-model="payPassword1" maxlength="6">
            <button-vue btn-color="#0278FE" btn-name="确认支付密码" @click="toThrid"></button-vue>
        </div>
    </div>
</template>

<style scoped>
* {
    margin: 0;
    padding: 0;
    list-style: none;
}

.container {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #fff;
}

.box {
    margin: 0px auto 0;
    text-align: center;
    width: 100%;
    background-color: #fff;
    padding: 10px 0;
}

.title {
    font-size: 16px;
    margin: 10px 0;
}

input {
    width: 80%;
    font-size: 22px;
    outline: none;
    padding: 10px 0;
    border: transparent;
    border-bottom: 1px solid lightgray;
    margin: 20px 0;
}
</style>